<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>蓝星图书-用户管理</title>
    <!-- 图标 -->
    <link rel="shortcut icon" href="https://static.websiteonline.cn/website/template/default/images/favicon.ico"
        type="image/x-icon" />
    <link rel="Bookmark" href="https://static.websiteonline.cn/website/template/default/images/favicon.ico" />
    
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/layui/css/layui.css">

    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <!-- Layui -->
    <script src="/layui/layui.js"></script>
    <script src="/js/backstage/user_control.js"></script>
    <script>
        layui.use('laypage', function () {
            var laypage = layui.laypage;

            //执行一个laypage实例
            laypage.render({
                elem: 'pageUser', //注意，这里的 test1 是 ID，不用加 # 号
                count: 50, //数据总数，从服务端得到
                limit: 10, // 每页显示条数
                //layout: ['limit'], // 每页条数下拉框 结合limits使用
                // limits: [10, 20, 30, 40, 50] 
            });
        });
    </script>

</head>

<body>
    <!-- 顶部导航 -->
    <script src="/js/backstage/header.js"></script>

    <!-- 内容 -->
    <div class="layui-col-md12">
        <!-- 左侧导航 -->
        <script src="/js/backstage/left_nav.js"></script>
        <!-- 对应导航内容 -->
        <div class="layui-col-md10" style="margin-left: 300px;">
            <button type="button" class="layui-btn" onclick="saveUser()" style="margin-top: 4%;">新增</button>
            <table class="layui-table">
                <colgroup>
                    <col width="150">
                    <col width="200">
                    <col>
                </colgroup>
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>昵称</th>
                        <th>邮箱</th>
                        <th>密码</th>
                        <th>电话</th>
                        <th>地址</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>1</td>
                        <td>张三</td>
                        <td>2568425312@qq.com</td>
                        <td>
                            <input type="password" value="1214564654" style="background-color: #fff;border: 0px;"
                                disabled />
                        </td>
                        <td>15986232158</td>
                        <td>四川省成都市孵化园</td>
                        <td>
                            <button type="button" onclick="updateUser(1)" class="layui-btn layui-btn-sm">
                                <i class="layui-icon">&#xe642;</i>
                            </button>
                            <button type="button" onclick="deleteUser(1)"
                                class="layui-btn layui-btn-sm layui-btn-danger">
                                <i class="layui-icon">&#xe640;</i>
                            </button>
                        </td>
                    </tr>
                    <tr>
                        <td>1</td>
                        <td>张三</td>
                        <td>2568425312@qq.com</td>
                        <td>
                            <input type="password" value="1214564654" style="background-color: #fff;border: 0px;"
                                disabled />
                        </td>
                        <td>15986232158</td>
                        <td>四川省成都市孵化园</td>
                        <td>
                            <button type="button" onclick="updateUser(1)" class="layui-btn layui-btn-sm">
                                <i class="layui-icon">&#xe642;</i>
                            </button>
                            <button type="button" onclick="deleteUser(1)"
                                class="layui-btn layui-btn-sm layui-btn-danger">
                                <i class="layui-icon">&#xe640;</i>
                            </button>
                        </td>
                    </tr>
                    <tr>
                        <td>1</td>
                        <td>张三</td>
                        <td>2568425312@qq.com</td>
                        <td>
                            <input type="password" value="1214564654" style="background-color: #fff;border: 0px;"
                                disabled />
                        </td>
                        <td>15986232158</td>
                        <td>四川省成都市孵化园</td>
                        <td>
                            <button type="button" onclick="updateUser(1)" class="layui-btn layui-btn-sm">
                                <i class="layui-icon">&#xe642;</i>
                            </button>
                            <button type="button" onclick="deleteUser(1)"
                                class="layui-btn layui-btn-sm layui-btn-danger">
                                <i class="layui-icon">&#xe640;</i>
                            </button>
                        </td>
                    </tr>

                </tbody>
            </table>
            <br />
            <div id="pageUser"></div>
        </div>
    </div>

    <!-- 新增普通用户 与查看共用一个 -->
    <div style="display: none;" id="saveUser">
        <form action="/index" class="layui-form" method="POST">
            <input type="text" name="title" required lay-verify="required" placeholder="请输入昵称" autocomplete="off"
                class="layui-input">
            <input type="email" name="title" required lay-verify="required" placeholder="请输入邮箱" autocomplete="off"
                class="layui-input">
            <input type="text" name="title" required lay-verify="required" placeholder="请输入电话" autocomplete="off"
                class="layui-input">
            <input type="text" name="title" required lay-verify="required" placeholder="请输入地址" autocomplete="off"
                class="layui-input">
            <button type="submit" class="layui-btn layui-btn-fluid">新增</button>
            <br />
            <button type="reset" class="layui-btn layui-btn-danger layui-btn-fluid">重置</button>
        </form>
    </div>

    <!-- 修改普通用户 -->
    <div style="display: none;" id="updateUser">
        <form action="/index" class="layui-form" method="POST">
            <input type="text" name="title" required lay-verify="required" placeholder="请输入昵称" autocomplete="off"
                class="layui-input">
            <input type="email" name="title" required lay-verify="required" placeholder="请输入邮箱" autocomplete="off"
                class="layui-input">
            <input type="text" name="title" required lay-verify="required" placeholder="请输入密码" autocomplete="off"
                class="layui-input">
            <input type="text" name="title" required lay-verify="required" placeholder="请输入电话" autocomplete="off"
                class="layui-input">
            <input type="text" name="title" required lay-verify="required" placeholder="请输入地址" autocomplete="off"
                class="layui-input">
            <button type="submit" class="layui-btn layui-btn-fluid">修改</button>
            <br />
            <button type="reset" class="layui-btn layui-btn-danger layui-btn-fluid">重置</button>
        </form>
    </div>

</body>

</html>